// 定义角色映射
const roleMap = {
    dev: '开发',
    test: '测试'
};

// 定义状态映射（颜色和文本）
const statusMap = {
    EFFECTIVE: {
        text: '在线',
        className: 'status-success'
    },
    INVALID: {
        text: '离线',
        className: 'status-error'
    }
};

// 定义接口地址
const API_URL = 'https://admin-feature.vbkrhk.com/auto-ai/vops/user/effective/userList';

// 缓存DOM元素
const tbody = document.querySelector('tbody');
const loader = document.querySelector('.loader'); // 缓存加载动画元素

// 渲染表格函数
function renderTable(data) {
    tbody.innerHTML = ''; // 清空现有内容

    data.forEach(item => {
        // 创建新的行
        const tr = document.createElement('tr');
        tr.setAttribute('data-uid', item.uid);       // 隐藏属性：uid
        tr.setAttribute('data-username', item.userName); // 隐藏属性：username
        tr.setAttribute('data-token', item.opsToken); // 隐藏属性：username

        // 工号（userName）
        const tdUserName = document.createElement('td');
        tdUserName.textContent = item.userName;
        tr.appendChild(tdUserName);

        // 名字（name）
        const tdName = document.createElement('td');
        tdName.textContent = item.name;
        tr.appendChild(tdName);

        // 角色（role）
        const tdRole = document.createElement('td');
        tdRole.textContent = roleMap[item.role] || item.role; // 映射角色
        tr.appendChild(tdRole);

        // 状态（opsTokenStatus）
        const tdStatus = document.createElement('td');
        const statusItem = statusMap[item.opsTokenStatus];
        if (statusItem) {
            // 创建状态指示器
            const indicator = document.createElement('span');
            indicator.className = `status-indicator ${statusItem.className}`;
            tdStatus.appendChild(indicator);
            tdStatus.appendChild(document.createTextNode(` ${statusItem.text}`));
        } else {
            tdStatus.textContent = item.opsTokenStatus;
        }
        tr.appendChild(tdStatus);

        // 更新时间（updateTime）
        const tdUpdateTime = document.createElement('td');
        tdUpdateTime.textContent = item.updateTime;
        tr.appendChild(tdUpdateTime);

        // 操作按钮
        if (item.opsTokenStatus === 'EFFECTIVE') {
            const tdAction = document.createElement('td');
            const actionBtn = createActionButton(item);
            tdAction.appendChild(actionBtn);
            tr.appendChild(tdAction);
        }

        tbody.appendChild(tr);
    });
}

function createActionButton(item) { // 接收 item 参数
    // 创建按钮容器
    const container = document.createElement('div');
    container.className = 'action-container';

    // 创建原有按钮（清除Cookie按钮）
    const clearBtn = document.createElement('button');
    clearBtn.className = 'action-btn';

    // 原有按钮的SVG图标（假设是清除图标，路径需根据设计调整）
    const clearSvg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
    clearSvg.setAttribute('class', 'icon');
    clearSvg.setAttribute('viewBox', '0 0 24 24');
    clearSvg.innerHTML = '<path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zm2.2-7.8l.9.8L15.8 4l.8.9L17 5.8l-4.9 4.8 4.9 4.9-.8.9L15.8 17l-.9-.8L12 13.2l-4.9 4.9L6.3 17l.9-.8L10 12.2 6.1 8.3 5.2 7.4 10 2.6 13.8 6.4 14.6 7.2 12 9.8z"/>';
    clearBtn.appendChild(clearSvg);

    // 创建提示框元素
    const tooltip = document.createElement('div');
    tooltip.className = 'tooltip';
    tooltip.textContent = '妮蔻，变Ta';
    document.body.appendChild(tooltip);

    // 使用 mouseenter/mouseleave 替代 mouseover/mouseout（更稳定）
    clearBtn.addEventListener('mouseenter', (e) => {
        tooltip.style.display = 'block';

        // 根据鼠标坐标计算位置（修正边界检测逻辑）
        const tooltipRect = tooltip.getBoundingClientRect();
        const btnRect = clearBtn.getBoundingClientRect();
        const mouseX = e.pageX;
        const mouseY = e.pageY;

        // 初始位置：按钮右上角左方
        let left = mouseX - tooltipRect.width - 10; // 左侧留10px间隙
        let top = mouseY - tooltipRect.height / 2; // 垂直居中

        // 边界检查：防止超出左侧屏幕
        if (left < 0) {
            left = 10; // 紧贴左侧
        }

        // 边界检查：防止超出右侧屏幕
        const maxRight = window.innerWidth - tooltipRect.width;
        if (left > maxRight) {
            left = maxRight; // 紧贴右侧
        }

        // 边界检查：防止超出顶部屏幕
        if (top < 0) {
            top = 10; // 紧贴顶部
        }

        // 边界检查：防止超出底部屏幕
        const maxBottom = window.innerHeight - tooltipRect.height;
        if (top > maxBottom) {
            top = maxBottom - 10; // 紧贴底部上方
        }

        // 应用最终位置
        tooltip.style.left = `${left}px`;
        tooltip.style.top = `${top}px`;
    });

    clearBtn.addEventListener('mouseleave', () => {
        tooltip.style.display = 'none';
    });

    // 防止鼠标移动到提示框时触发隐藏（补充逻辑）
    tooltip.addEventListener('mouseenter', () => {
        // 进入提示框时不隐藏
    });
    tooltip.addEventListener('mouseleave', () => {
        tooltip.style.display = 'none';
    });

    // 创建提示框元素
    const tooltip2 = document.createElement('div');
    tooltip2.className = 'tooltip';
    tooltip2.textContent = '点击复制！';
    document.body.appendChild(tooltip2);
    // 创建复制按钮
    const copyBtn = document.createElement('button');
    copyBtn.className = 'action-btn copy-btn';

    // 复制按钮的SVG图标（复制图标）
    const copySvg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');

    copySvg.setAttribute('class', 'icon');
    copySvg.setAttribute('viewBox', '0 0 24 24');
    copySvg.innerHTML = '<path d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm-2 16H6v-2h4v-4h2v4h4v2h-4v4h-2v-4H8V7h2V3h4v2h4l.001 14H14z"/>';
    copyBtn.appendChild(copySvg);
// 使用 mouseenter/mouseleave 替代 mouseover/mouseout（更稳定）
    copyBtn.addEventListener('mouseenter', (e) => {
        tooltip2.style.display = 'block';

        // 根据鼠标坐标计算位置（修正边界检测逻辑）
        const tooltipRect = tooltip2.getBoundingClientRect();
        const btnRect = copyBtn.getBoundingClientRect();
        const mouseX = e.pageX;
        const mouseY = e.pageY;

        // 初始位置：按钮右上角左方
        let left = mouseX - tooltipRect.width - 10; // 左侧留10px间隙
        let top = mouseY - tooltipRect.height / 2; // 垂直居中

        // 边界检查：防止超出左侧屏幕
        if (left < 0) {
            left = 10; // 紧贴左侧
        }

        // 边界检查：防止超出右侧屏幕
        const maxRight = window.innerWidth - tooltipRect.width;
        if (left > maxRight) {
            left = maxRight; // 紧贴右侧
        }

        // 边界检查：防止超出顶部屏幕
        if (top < 0) {
            top = 10; // 紧贴顶部
        }

        // 边界检查：防止超出底部屏幕
        const maxBottom = window.innerHeight - tooltipRect.height;
        if (top > maxBottom) {
            top = maxBottom - 10; // 紧贴底部上方
        }

        // 应用最终位置
        tooltip2.style.left = `${left}px`;
        tooltip2.style.top = `${top}px`;
    });

    copyBtn.addEventListener('mouseleave', () => {
        tooltip2.style.display = 'none';
    });
    // 防止鼠标移动到提示框时触发隐藏（补充逻辑）
    tooltip2.addEventListener('mouseenter', () => {
        // 进入提示框时不隐藏
    });
    tooltip2.addEventListener('mouseleave', () => {
        tooltip2.style.display = 'none';
    });
    // 将按钮添加到容器
    container.appendChild(copyBtn);
    container.appendChild(clearBtn);

    // 添加事件监听器
    addCopyButton(copyBtn, item.opsToken); // 传入 opsToken
    // addClearButton(clearBtn, item.cookie); // 传入 opsToken
    // 返回容器
    return container;
}
function addCopyButton(btn, cookie) {
    btn.addEventListener('click', async () => {
        try {
            await navigator.clipboard.writeText(cookie);
            showTooltip('已复制到剪贴板', 'success');
        } catch (err) {
            showTooltip('复制失败', 'error');
        }
    });
}
// function addClearButton(btn, token) {
// 	btn.addEventListener('click', () => {
// 		// 清除当前Cookie
// 		// deleteCookie('your_cookie_name'); // 替换为你的Cookie名称
// 		//
// 		// // 写入新的Cookie（假设有效期为1天）
// 		// setCookie('your_cookie_name', token, 1);
//
// 		showTooltip('Cookie已更新', 'success');
// 		location.reload(); // 刷新页面
// 	});
// }

function addClearButton(btn, cookieString) {
    btn.addEventListener('click', () => {
        // 1. 获取当前标签页
        chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
            if (tabs.length === 0) {
                showTooltip('无法获取当前标签页', 'error');
                return;
            }

            const tab = tabs[0];
            const url = new URL(tab.url);

            // 2. 检查域名是否匹配
            if (url.hostname !== 'vops.hszq8.com') {
                showTooltip('请在 Vops 页面操作', 'error');
                return;
            }

            // 3. 删除所有现有 Cookie
            chrome.cookies.getAll({ url: tab.url }, (existingCookies) => {
                let remainingDeletes = existingCookies.length;
                let hasError = false;

                existingCookies.forEach((cookie) => {
                    chrome.cookies.remove(
                        {
                            url: tab.url,
                            name: cookie.name,
                            domain: cookie.domain // 使用现有 Cookie 的 domain
                        },
                        () => {
                            if (chrome.runtime.lastError) {
                                hasError = true;
                                console.error('删除 Cookie 失败:', chrome.runtime.lastError.message);
                            }
                            remainingDeletes--;
                            // 当所有删除完成后开始写入新 Cookie
                            if (remainingDeletes === 0) {
                                if (hasError) {
                                    showTooltip('部分 Cookie 删除失败', 'error');
                                    return;
                                }
                                writeNewCookies(tab.url, cookieString);
                            }
                        }
                    );
                });
            });
        });
    });
}

function writeNewCookies(url, cookieString) {
    // 4. 解析传入的 Cookie 字符串
    const cookiePairs = cookieString.split(/;\s*/).filter(pair => pair.trim() !== '');
    let remainingSets = cookiePairs.length;
    let hasError = false;

    cookiePairs.forEach((pair) => {
        const [name, value] = pair.split('=');
        if (!name || !value) return; // 跳过无效的 Cookie 对

        chrome.cookies.set(
            {
                url: url,
                name: name.trim(),
                value: decodeURIComponent(value), // 解码原始值
                domain: 'vops.hszq8.com', // 明确指定域名
                path: '/',
                secure: url.startsWith('https://'), // 根据协议自动判断
                sameSite: 'no_restriction' // 根据需求调整
            },
            () => {
                if (chrome.runtime.lastError) {
                    hasError = true;
                    console.error('写入 Cookie 失败:', chrome.runtime.lastError.message);
                }
                remainingSets--;
                // 当所有写入完成后显示结果
                if (remainingSets === 0) {
                    if (hasError) {
                        showTooltip('部分 Cookie 写入失败', 'error');
                    } else {
                        showTooltip('Cookie 已更新', 'success');
                        location.reload(); // 刷新弹窗
                    }
                }
            }
        );
    });
}
let toast = null;

function showTooltip(text, type = 'info') {
    if (toast) {
        toast.remove();
    }

    toast = document.createElement('div');
    toast.className = `toast ${type}`;
    toast.textContent = text;
    document.body.appendChild(toast);

    setTimeout(() => {
        toast.remove();
        toast = null;
    }, 1500);
}

// 获取数据并渲染（带加载动画）
async function fetchData() {
    try {
        // 显示加载动画
        loader.style.display = 'block';

        const response = await fetch(API_URL);
        const result = await response.json();

        if (result.code === 0 && Array.isArray(result.data)) {
            renderTable(result.data);
        } else {
            console.error('接口返回数据格式错误:', result);
        }
    } catch (error) {
        console.error('请求失败:', error);
    } finally {
        // 无论成功或失败，最后隐藏加载动画
        loader.style.display = 'none';
    }
}

// 初始化：页面加载时执行
document.addEventListener('DOMContentLoaded', () => {
    // 首次加载数据
    fetchData();

    // 每 5 秒刷新一次（保持原有逻辑）
    setInterval(fetchData, 5000);
});